<!--
 * @Author: GuoShuning
 * @Date: 2022-12-15 14:02:11
 * @LastEditors: GuoShuning
 * @LastEditTime: 2022-12-17 14:43:32
 * @Description: 
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />

  <link rel="stylesheet" href="./common/css/coommon.css" />
  <title>审批中心</title>
</head>

<body>
  <div class="approvalCenter itemBoxContent">
    <div class="tab_button">
      <button class="button_primary">全部审批</button>
      <button class="button_primary_plain">成本概算</button>
      <button class="button_primary_plain">采购审批</button>
      <button class="button_primary_plain">终验审批</button>
      <button class="button_primary_plain">采购计划</button>
    </div>
    <div class="allSelect">
      <div class="leftSelect">
        <div class="itemSelect">
          <div class="input-group">
            <label>项目名称</label>
            <input placeholder="输入关键字" />
          </div>
        </div>
        <div class="itemSelect">
          <div class="input-group">
            <label>项目人员</label>
            <input placeholder="输入人员姓名" />
          </div>
        </div>
        <div class="itemSelect">
          <div class="input-group">
            <label>预警时间</label>
            <input placeholder="输入关键字" />
          </div>
        </div>
        <div class="itemSelect">
          <div class="select-group">
            <label>预警类型</label>
            <div class="options">
              <input placeholder="输入关键字" />
              <ul>
                <li>输入关键字</li>
                <li>输入关键字</li>
                <li>输入关键字</li>
                <li>输入关键字</li>
              </ul>
            </div>
          </div>
        </div>
        <div class="itemSelect">
          <div class="select-group">
            <label>处理状态</label>
            <div class="options">
              <input placeholder="输入关键字" />
              <ul>
                <li>输入关键字</li>
                <li>输入关键字</li>
                <li>输入关键字</li>
                <li>输入关键字</li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      <div class="rightBtn">
        <button class="button_primary button_icon"><i class="bi bi-search btnIcon"></i>搜索</button>
        <button class="button_primary_plain button_icon"><i class="bi bi-arrow-clockwise btnIcon"></i>重置</button>
      </div>
    </div>
    <div class="bottomBox">
      <div class="tableListCount">待审批事项数 <span>12</span>个</div>
      <div class="table">
        <div class="table-header">
          <div class="tr">
            <div class="td" style="width: 15%">项目名称</div>
            <div class="td center" style="width: 10%">审批类型</div>
            <div class="td center" style="width: 10%">数量</div>
            <div class="td center" style="width: 10%">金额</div>
            <div class="td center" style="width: 10%">成本</div>
            <div class="td center" style="width: 10%">采购分类</div>
            <div class="td center" style="width: 10%">申请人</div>
            <div class="td center" style="width: 10%">提交时间</div>
            <div class="td center" style="width: 13%">审批人</div>
            <div class="td" style="width: 17%">审批状态</div>
            <div class="td" style="width: 10%">操作</div>
          </div>
        </div>
        <div class="table-body">
          <div class="tr">
            <div class="td" style="width: 15%">项目名称</div>
            <div class="td center" style="width: 10%">采购清单审批</div>
            <div class="td center" style="width: 10%">5</div>
            <div class="td center" style="width: 10%">8</div>
            <div class="td center" style="width: 10%">96</div>
            <div class="td center" style="width: 10%">合同</div>
            <div class="td center" style="width: 10%">孙小权</div>
            <div class="td center" style="width: 10%">2022-11-15 08:22</div>
            <div class="td center" style="width: 13%">
              <button class="success_pass">售前：王婷婷</button>
              <button class="error_pass">售前：李鑫宇</button>
              <button class="error_pass">商务：李姝静</button>
            </div>
            <div class="td" style="width: 17%">
              <div>售前：王婷婷<button class="button_success_text">审批通过</button></div>
              <div>售前：李鑫宇<button class="button_success_text">审批通过</button></div>
              <div>售前：王婷婷<button class="button_error_text">审批不通过</button></div>
            </div>
            <div class="td" style="width: 10%">
              <button class="button_success_text">处理</button>
              &ensp;
              <button class="button_primary_text">查看</button>
            </div>
          </div>
        </div>
      </div>
      <div class="pagination">
        <span>共 200 条</span>
        <ul>
          <li><i class="bi bi-chevron-left"></i></li>
          <li class="active">1</li>
          <li>2</li>
          <li>3</li>
          <li>4</li>
          <li>...</li>
          <li><i class="bi bi-chevron-right"></i></li>
        </ul>
      </div>
    </div>
  </div>
</body>

</html>